import "./style.scss";
import DangeTag from "@page/common/comps/DangeTag";
import ProtocolTag from "@page/common/comps/ProtocolTag";
import Uts from "@module/Uts";
import showLoginModal from "@root/P/pages/LoginModal/showLoginModal"


class GoodItem extends React.Component {
    jump = (sn, suppId) => {
        window.open(`#detail?productId=${sn}&suppId=${suppId}`);
    };

    isSuppSelf(suppId){
        const isSuppSelf=Uts.getCookie('suppId')==suppId;
        return isSuppSelf;
    }

    render() {
        const { list } = this.props;

        return (
            <div className="rj_good_list rj-fade-in">
                <div className="rj_good_list-top">
                    {["商品信息", "规格", "货号", "品牌", "价格"].map(
                        (item, index) => {
                            return (
                                <div
                                    className={Uts.sc([index==0?'zen_w-p35 zen_m-l-20':(index==3?'zen_w-p15':'zen_w-p15')])}
                                    key={Math.random().toString()}
                                >
                                    {item}
                                </div>
                            );
                        }
                    )}
                </div>
                <div>
                    {list.map((item, index) => {
                        return (
                            <div
                                key={Math.random().toString()}
                                onClick={this.jump.bind(
                                    this,
                                    item.sn,
                                    item.suppId
                                )}
                                className="rj_good_list-bottom"
                            >
                                <div className="zen_w-p35 zen_m-l-20 zen_3C3C3C">
                                    <div
                                        className="zen_m-r-5 zen_f-left zen_elli zen_m-w-p70"
                                        dangerouslySetInnerHTML={{
                                            __html: item.name
                                        }}
                                    />
                                    {item.dangerousTag &&
                                        item.dangerousTag != "其他" &&
                                        item.dangerousTag != "常规化学品" && (
                                            <DangeTag
                                                dangerousTag={item.dangerousTag}
                                            />
                                        )}
                                    {item.negotiatedPrice && (
                                        <span className="zen_fs-12 zen_p-h-4 zen_p-v-2 zen_m-l-5 zen_bg-FF6D0B zen_FFFFFF zen_bdr-4">
                                            协议价
                                        </span>
                                    )}
                                    
                                </div>

                                <div
                                    dangerouslySetInnerHTML={{
                                        __html: item.specification
                                    }}
                                    className="zen_w-p15 zen_elli"
                                />

                                <div className="zen_w-p15">
                                    <div
                                        dangerouslySetInnerHTML={{
                                            __html:  item.productNum
                                        }}
                                        className="zen_m-w-p70 zen_elli"></div>
                                </div>
                                
                                <div className="zen_w-p15">
                                    <div
                                        dangerouslySetInnerHTML={{
                                            __html: item.brandName||'无'
                                        }}
                                        className="zen_elli zen_f-left"
                                        style={{maxWidth:item.protocol=='1'?'60%':'100%'}}
                                    />
                                     {item.protocol=='1' && (
                                        //
                                         <ProtocolTag className="zen_fs-12 zen_bg-58d1bd zen_FFFFFF zen_p-v-2 zen_p-h-5 zen_bdr-3 zen_m-l-3" />
                                    )}
                                </div>
                                {
                                    (!global.hasLogin&&!this.isSuppSelf( item.suppId) )?
                                        (
                                            <div
                                                onClick={(e)=>{
                                                    e.stopPropagation()
                                                    showLoginModal(false,true)
                                                }}
                                                className="zen_fs-18 zen_F5222D zen_cur-p">
                                                <p>{global.isSupp? "单位登录可见":"登录可见"}</p>
                                            </div>
                                        )
                                        :
                                        (
                                            <div className="zen_w-p15 zen_elli zen_fs-18 zen_F5222D">
                                                <em>¥</em>
                                                {Filter.float(item.price, 2)}
                                                {item.activityPrice && (
                                                <span style={{top:'-2px'}} className="zen_fs-12 zen_p-h-4 zen_ps-re zen_p-v-2 zen_m-l-5 zen_bg-FF6D0B zen_FFFFFF zen_bdr-4">
                                                    限时折扣
                                                    </span>
                                                )}
                                                {item.groupBuying && (
                                                    <span style={{top:'-2px'}} className="zen_fs-12 zen_ps-re zen_p-h-4 zen_p-v-2 zen_m-l-5 zen_bg-FF6D0B zen_FFFFFF zen_bdr-4">
                                                        团购
                                                    </span>
                                                )}
                                            </div>
                                    )
                                }
                            </div>
                        );
                    })}
                </div>
            </div>
        );
    }
}

export default GoodItem;
